<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core">
 
       <div class="tab-pane fade" id="university">
           <div class="hero-unit"> 
               <c:if test="${universitiesMB.isSuccess()}">
                              <div class="alert alert-success">
                                  <button type="button" class="close" data-dismiss="alert">x</button>
                                  Universidad vinculado exitosamente
                                  <script>
                                      $(document).ready(function() {
                                          $('input[type="text"]').val('');
                                      });
                                      
                                  </script>
                              </div>
              </c:if>
              <h2>Universidades vinculadas a SuiLib</h2>
              <input type="button" class="btn  btn-info" data-toggle="modal" href="#createUniversity" value="Vincular Nueva" />
              <br/>
              <h:dataTable class="table table-bordered table-striped" style="background-color: white;" value="#{universitiesMB.universities}" var="university" binding="#{universitiesMB.table}">
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Universidad"/>
                            </f:facet>
                            <h:outputText value="#{university.name}"/>
                        </h:column>
                        <h:column> 
                               <f:facet name="header">
                                    <h:outputText value="Usuario"/>
                               </f:facet>
                               <h:outputText value="#{university.userName}"/>
                        </h:column>
                        <h:column>
                               <f:facet name="header">
                                  <h:outputText value="Ubicación"/>
                               </f:facet>
                               <h:outputText value="#{university.location}"/>
                        </h:column>
                        <h:column>
                               <f:facet name="header">
                                  <h:outputText value="Más"/>
                               </f:facet>
                            <h:form>
                                <h:commandLink action="#{universitiesMB.deleteFormList()}"> <h:graphicImage url="../img/icons/icon-delete.jpg"/> </h:commandLink>
                                <img src="../img/icons/icon_edit.gif"/><img src="../img/icons/icon-details.gif"/>
                            </h:form>
                              
                              
                        </h:column>
                   </h:dataTable>
                   <!--Tabla de todas las Universidades-->
            </div> 
       </div>
        <!--Ventana Modal para crear Univarsidad-->
        <div id="createUniversity" class="modal hide fade in" style="display: none; ">
        <div class="modal-header">
          <a class="close" data-dismiss="modal">x</a>
          <h2>Crear Universidad</h2>
          <h:form>
            <h:outputText value="Nombre:"/>
            <br/>
            <h:inputText class="span6" value="#{universitiesMB.name}"/>
            <br/>
            <h:outputText value="Usuario:"/>
            <br/>
            <h:inputText class="span6" value="#{universitiesMB.userVO.username}"/>
            <br/>
            <h:outputText value="Contraseña:"/>
            <br/>
            <h:inputText class="span6" value="#{universitiesMB.userVO.password}"/>
            <br/>
            <h:commandButton value="Agregar" class="btn btn-info" action="#{universitiesMB.createUniversity()}"/>
          </h:form>
        </div>
        </div>      

</html>